<template>
	<view class="article-detail">

		<view class="bg">	
			<view class="header">
				{{ data.title }}
			</view>
		</view>
		<view class="article-detail-content">

			{{ data.content }}
		</view>
	</view>
</template>
<script>
	// import{
	// 		getArticle,getSentence,createComment,fetchComment
	// 	} from '../../../service/article.service';
	import idea from '@/component/idea/index';
	export default {
		components: {},
		data() {
			return {
				data: {
					content: '',
					title:''
				},
				value: '',
				type: ''
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			const eventChannel = this.getOpenerEventChannel();
			const that = this;
			eventChannel.on('initData', function(data) {
				that.setData({
					data
				});
			});
		},
		methods: {
			onChange(e) {
				this.value=e.detail.value;
			}
		}
	};
</script>
<style>
	.bg-img {
		filter: blur(2.5px);
		z-index: -1;
		position: fixed;
	}

	.bg {
		height: 200rpx;
		/* position: sticky; */
	}

	.article-detail-content {
		width: 88%;
		margin: 0 auto;
		box-sizing: border-box;
		background-color: rgb(196, 240, 229);
		border-radius: 50rpx;
		padding: 3%;
		flex: 1;
	}

	.header {
		top: 0;
		position: sticky;
		z-index: 1;
		width: 68%;
		margin: 0 auto;
		border-radius: 50rpx;
		font-size: x-large;
	}

	.input {
		position: fixed;
		bottom: 10rpx;
		left: 10rpx;
		right: 10rpx;
	}

	page {
		padding-bottom: 100rpx;
	}

	.comment-item {
		font-size: 40rpx;
		border: 2rpx solid rgb(168, 204, 198);
	}
</style>
